<template>
  <div class="app-container">
    <el-card style="margin-top: 16px">
      <div slot="header" style="display: flex; justify-content: space-between">
        <span><i class="el-icon-collection"></i> 库龄数据</span>
        <span>
          <el-form :model="queryParams" :inline="true" size="small">
            <el-form-item label="" prop="shopId">
              <el-select
                v-model="queryParams.brandList"
                multiple
                placeholder="选择品牌"
                filterable
                @change="getdefinitionInventoryAgeRange"
                style="width: 300px"
              >
                <el-option
                  v-for="dict in dict.type.sys_product_pp"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.label"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="" prop="shopId">
              <el-select
                style="width: 300px"
                v-model="queryParams.firstLevelColumnList"
                placeholder="一级品类"
                @change="getdefinitionInventoryAgeRange"
                multiple
              >
                <el-option
                  v-for="dict in dict.type.sys_product_pl"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="" prop="shopId"
              ><el-button
                style="margin-left: 5px"
                type="warning"
                plain
                icon="el-icon-download"
                size="mini"
                @click="handleExportIII"
                >导出</el-button
              ></el-form-item
            >
          </el-form>
        </span>
      </div>
      <tableI :tableDataList="tableDataIII" />
    </el-card>
  </div>
</template>

<script>
import { definitionInventoryAgeRange } from "@/api/Warehouse/BiInventoryAgeDwd";
import tableI from "./zindex/table.vue";
export default {
  dicts: ["sys_product_pl", "sys_product_pp"],
  components: {
    tableI,
  },
  data() {
    return {
      tableDataIII: [],
      // 查询参数
      queryParams: {
        firstLevelColumnList: [],
      },
    };
  },
  created() {
    this.getdefinitionInventoryAgeRange();
  },
  methods: {
    getdefinitionInventoryAgeRange() {
      definitionInventoryAgeRange(this.queryParams).then((response) => {
        this.tableDataIII = response;
      });
    },
    /** 导出按钮操作 */
    handleExportIII() {
      // let obj = {
      //   firstLevelColumnList: this.firstLevelColumnList,
      // };
      this.download(
        "/financial/BiInventoryAgeDwd/definitionInventoryAgeRangeExport",
        {
          ...this.queryParams,
        },
        `库龄数据_${new Date().getTime()}.xlsx`
      );
    },
  },
};
</script>